<!-- 若配置了lvAutocompleteScroll，请配置单个选项高度的整数倍，否则lvScrollEnd可能无法触发 -->
<input
  lv-input
  lv-autocomplete
  [(ngModel)]="value"
  [lvAutocompleteData]="data"
  [lvAutocompleteHighlightContent]="value"
  [lvAutocompleteVirtualScroll]="true"
  (lvAutocompleteScrollEnd)="scroll()"
  style="width: 368px; margin-bottom: 8px"
/>
<p>异步场景</p>
<p>When more than 2 characters are entered, event is triggered.</p>
<lv-input-group lvSize="large" [lvSuffix]="loadingTpl" style="width: fit-content; padding: 0;">
  <input
    lv-input
    lv-autocomplete
    [(ngModel)]="asyncValue"
    (lvAutocompleteInputChange)="inputChange($event)"
    lvAutocompleteSize="large"
    [lvAutocompleteLoading]="loading"
    [lvAutocompleteData]="asyncData"
    [lvAutocompleteVirtualScroll]="true"
    (lvAutocompleteScrollEnd)="asyncScroll()"
    style="width: 368px; padding-left: 8px;"
  />
</lv-input-group>

<ng-template #loadingTpl>
  <ng-container *ngIf="panelLoading">
    <img src="assets/webp/gray.png" alt="icon-loading" class="lv-icon-loading" style="width: 16px; height: 16px" />
  </ng-container>
</ng-template>
